<template>

      <ve-line
        :data="chartData"
        :legend="chartLegend"
        :extend="chartExtend"
        :settings="chartSettings"
        :grid="chartGrid"
        height="300px"
      ></ve-line>
</template>

<script>


  export default {
    name: "MemberStatistics",
    data() {

      this.chartLegend = {
        show: true,
        bottom: 5,
        left: 'center',
        orient: "horizontal"
      };
      this.chartGrid = {
        top: 20,
        left: 20,
        right: 20,
        bottom: 30
      };
      this.chartExtend = {
        series: {
          barWidth: 10,
          label: {
            normal: {
              show: true
            }
          }
        }
      };
      this.chartSettings = {
        labelMap: {
          'register': '注册人数',
          'recommend': '推荐人数',
          'active': '活跃人数'
        }
      };

      return {
        chartData: {
          columns: ['date', "register","recommend", "active"],
          rows: []
        },
        queryParams: {
          startDate: '',
          endDate: '',
        }
      }
    },
    methods: {
      init() {
        //近7天贷款统计
        //活跃用户今日统计
        let params = {
          startDate: moment(new Date()).subtract(7, 'days').format('YYYY-MM-DD'),
          endDate: moment(new Date()).format('YYYY-MM-DD')
        };

        memberStatistics(params).then((res) => {
            this.isLoading = false;
            if (res.code === 100) {
                this.chartData.rows = res.data.detailStatistics;
            } else {
                this.$message.error(res.msg)
            }
        });

      }
    },
    mounted() {
      this.init();
    }
  }
</script>

<style scoped>

</style>
